<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>GuessNumber</title>
</head>
<body>
<div style="text-align: center;font-size: 100px;color: aquamarine">猜数字小游戏</div>
<div style="text-align: center"></div>
<div id="timer" style="text-align: center"></div>
<div id="warring"></div>
<div style="text-align: center">
    <label>
        <input id="num" type="text" style="width: 100px ;height: 20px">
    </label>
    <input id="submit" type="button" value="提交" onclick="guessNumber()">
</div>
<div id="guessHistory" style="text-align: center ;color: rebeccapurple">
    <span style="color: black ;font-size: 30px">以下是猜测历史记录<br></span>
</div>


</body>
<script>
    alert("这是一个猜数字小游戏，你在三分钟内只有十次猜数字的机会，具体规则如下，" +
        "该程序内部会产生四个不同的有序的一位数（1-9），" +
        "我们对这四个数字进行猜测，每次猜测四个数字（包括了顺序），" +
        "该程序会返回A，B两个值，A代表我们猜的数字中正确数字的个数，" +
        "B代表猜的数字中不仅正确而且处于正确位置上的数字的个数。" +
        "如程序内部产生的是4327，我们猜1324，则A=3，" +
        "表示3,2,4这3个数字是正确的，B=2，表示2,3这2个数字不仅正确还处于正确的位置。准备好了就点确定开始了哈！")
    var maxtime = 3 * 60;
    function CountDown() {
        if (maxtime >= 0) {
            minutes = Math.floor(maxtime / 60);
            seconds = Math.floor(maxtime % 60);
            msg = "距离结束还有" + minutes + "分" + seconds + "秒";
            document.all["timer"].innerHTML = msg;
            if (maxtime === 40)alert("距离结束仅剩40s");
            --maxtime;
        } else{
            clearInterval(timer);
            alert("时间到，结束!你好菜啊，要重新玩自己刷新页面");
            document.getElementById("submit").setAttribute("disabled",true);
        }
    }
    timer = setInterval("CountDown()", 1000);



    function rand(min,max) {
        return Math.floor(Math.random() * (max - min)) + min;
    }

    function getWei(number) {
        if (number>=1000){
            var s = ''+number;
            var res = [];
            for (var i = 0; i < s.length; i++) {
                res.push(s[i]);
            }
            return res;
        }else {
            alert("Number illegal!");
        }
    }
    var randomNum = rand(1000,9999);
    console.log(randomNum);
    var count = 0;
    function guessNumber() {
        if (count<10) {
            count++;
            var countA = 0;
            var countB = 0;
            var number = document.getElementById("num").value;
            var res = getWei(number);
            var ranRes = getWei(randomNum);
            if (res.toString() === ranRes.toString()) {
                alert("Right!");
            } else {
                var newArray = [res[0] - ranRes[0], res[1] - ranRes[1], res[2] - ranRes[2], res[3] - ranRes[3]];
                for (var i = 0; i < 4; i++) {
                    if (newArray[i] == 0) {
                        countA++;
                    }
                }
                var sum = [
                    res[0] - ranRes[1], res[0] - ranRes[2], res[0] - ranRes[3],
                    res[1] - ranRes[0], res[0] - ranRes[2], res[0] - ranRes[3],
                    res[2] - ranRes[0], res[0] - ranRes[1], res[0] - ranRes[3],
                    res[3] - ranRes[0], res[0] - ranRes[1], res[0] - ranRes[2]
                ]
                for (var i = 0; i < sum.length; i++) {
                    if (sum[i] == 0) {
                        countB++;
                    }
                }
                var history = document.getElementById("guessHistory").innerHTML;
                document.getElementById("guessHistory").innerHTML = history + countA + "A" + countB + "B"+"<br>";

            }

        }
        else {alert("你已经猜了10次了，你输了！");}
    }
</script>
</html>